.res-icon {
  vertical-align: -7px;
  font-size: 24px;
  display: inline-block;
  line-height: 1;
  width: 24px;
  height: 24px;
  text-align: center;
  margin-right: 5px;
  &:before {
    content: url("assets/icons/file.svg");
  }
  &.icon-folder {
    &:before {
      content: url("assets/icons/folder.svg");
    }
  }
  &.icon-image {
    &:before {
      content: url("assets/icons/image.svg");
    }
  }
  &.icon-html {
    &:before {
      content: url("assets/icons/html.svg");
    }
  }
  &.icon-javascript {
    &:before {
      content: url("assets/icons/javascript.svg");
    }
  }
  &.icon-style {
    &:before {
      content: url("assets/icons/css.svg");
    }
  }
  &.icon-json {
    &:before {
      content: url("assets/icons/json.svg");
    }
  }
  &.icon-markdown {
    &:before {
      content: url("assets/icons/markdown.svg");
    }
  }
  &.icon-music {
    &:before {
      content: url("assets/icons/music.svg");
    }
  }
  &.icon-movie {
    &:before {
      content: url("assets/icons/movie.svg");
    }
  }
  &.icon-zip {
    &:before {
      content: url("assets/icons/zip.svg");
    }
  }
}
